<?php require_once VIEWPATH.'Common/header.php'; ?>
<link rel="stylesheet" href="<?=STATICURL?>css/other/animate.css?v=<?=$version?>">
<link rel="stylesheet" href="<?=STATICURL?>css/other/animatedresponsiveImagegrid.css?v=<?=$version?>">
<link rel="stylesheet" href="<?=STATICURL?>css/other/magnific-popup.css?v=<?=$version?>">
<link rel="stylesheet" href="<?=STATICURL?>css/other/style.css?v=<?=$version?>">
<script src="<?=STATICURL?>js/other/modernizr-2.6.2.min.js"></script>
<!-- header -->
  <link href='https://fonts.googleapis.com/css?family=Roboto:400,100,300,700' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" href="<?=STATICURL?>css/item/item.css?v=<?=$version?>">
<?php require_once VIEWPATH.'Common/menu.php'; ?>
<!-- banner -->
<div class="contact">
<div >
     <img width="100%" src="<?=STATICURL?>images/item_banner.jpg" alt=""/>  
     </div>
    <div class="container">
        <div class='main'>
        <h3 class="main_title" ><img width="200" src="<?=STATICURL?>images/taichu_logo.png"></h3>
          <div id="fh5co-portfolio-section">
              <ul id="filters" class="clearfix animate-box">
                <li>
                  <a href="<?=BASEURL.'/item/index'?>">
                    <span <?php if($cat_id == ''):?>class="active"<?php endif;?> data-filter=".all">全部</span>
                  </a>
                </li>
                <?php foreach ($catList as $value):?>
                    <li >
                      <a href="<?=BASEURL.'/item/index?cat_id='.$value['cat_id']?>">
                        <span <?php if($cat_id == $value['cat_id']):?>class="active"<?php endif;?> ><?=$value['cat_name']?></span>
                      </a>
                    </li>
                <?php endforeach;?>
              </ul>
              <div class="container">
                <div id="ri-grid" class="ri-grid animate-box">
                  <img class="ri-loading-image" src="<?=STATICURL?>images/loading.gif"/>
                  <ul>
                   <?php foreach ($item_list as $key => $row): ?>
                    <li>
                      <a href="#">
                        <img src="<?=UPLOADURL.$row['imageurl']?>"/>
                        <div class="desc">
                          <h3><?=$row['name']?></h3>
                        </div>
                      </a>
                    </li>
                  <?php endforeach;?>    
                  </ul>
                </div>
          </div>
        </div>
    </div>
    <!-- <div class="clear"></div>
    <div id="moreload" class="more_btn">
      <div class="more_icon"></div>
      <span>更多</span>
    </div> -->
  </div>
<!-- footer -->
<?php require_once VIEWPATH.'Common/footer.php'; ?>
  <!-- Waypoints -->
  <script src="<?=STATICURL?>js/other/jquery.waypoints.min.js"></script>
  <!-- Counters -->
  <script src="<?=STATICURL?>js/other/jquery.countTo.js"></script>
  <!-- gridrotator -->
  <script type="text/javascript" src="<?=STATICURL?>js/other/jquery.gridrotator.js"></script>
  <!-- Magnific Popup -->
  <script type="text/javascript" src="<?=STATICURL?>js/other/jquery.magnific-popup.min.js"></script>
  <!-- Main JS (Do not remove) -->
  <script src="<?=STATICURL?>js/other/main.js"></script>
  <script type="text/javascript"> 
    $(function() {
      $( '#ri-grid' ).gridrotator( {
        rows : 3,
        // number of columns 
        columns : 7,
        w1024 : { rows : 3, columns : 5 },
        w768 : {rows : 3,columns : 4 },
        w480 : {rows : 3,columns : 3 },
        w320 : {rows : 2,columns : 2 },
        w240 : {rows : 1,columns : 1 },
        preventClick : false
      } );
    });
    
  </script>
